<template>
    <div id="content-header">
        <div class="center">
            <div
                class="center pointer item"
                @click="save"
            >
                <img
                    src="~assets/images/save-icon.png"
                    alt=""
                ><span>保存</span>
            </div>
            <div
                class="center pointer item"
                @click="cancel"
            >
                <img
                    src="~assets/images/cancel.png"
                    alt=""
                ><span>取消</span>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        data () {
            return {
            };
        },
        methods: {
            /**
             * 保存
             */
            save () {
                this.$parent.save();
            },
            /**
             * 取消
             */
            cancel () {
                this.$router.go(-1);
                this.$parent.cancel();
            }
        }
    };
</script>

<style lang="less" scoped>
@import '~assets/styles/variable';
#content-header {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: 40px;
    font-size: @font-size-medium;
    .item:last-child {
        margin-left: 20px;
    }
    img {
        width: 14px;
        margin-right: 5px;
    }
}
</style>
